<template>
	<view class="bar">
		<!-- <image @click="leftClick" class="left" src="../../static/guided_nav_icon_scancode@2x.png" mode="widthFix"></image> -->
		<input @blur="search" class="center" placeholder="根据名称查询..." />
		<image @click="rightClick" class="right" src="../../static/guided_nav_icon_scancode@2x.png" mode="widthFix"></image>
		<image class="input-after" src="../../static/guided_nav_icon_search@2x.png"></image>
	</view>
</template>

<script>
	export default {
		methods: {
			search() {

			}
		}
	}
</script>

<style>
	.bar {
		width: 100%;
		height: 120rpx;
		background: #B9AC90;
		display: flex;
		align-items: center;
		justify-content: space-between;
	}

	.bar .center {
		background: #eee;
		color: #B9AC90;
		font-size: 24rpx;
		width: 520rpx;
		height: 60rpx;
		line-height: 60rpx;
		padding: 0 60rpx 0 20rpx;
		border-radius: 5rpx;
		margin-left: 20rpx;
		/* background: #fff; */
	}

	.bar .left {
		width: 42rpx;
		margin-left: 40rpx;
		height: 42rpx;
	}

	.bar .right {
		width: 42rpx;
		height: 42rpx;
		margin-right: 40rpx;
	}
	
	.bar .input-after{
		height: 30rpx;
		width: 30rpx;
		position: absolute;
		right: 150rpx;
	}
</style>
